<template>
  <div class="kindcom">
    <div class="one" v-for="(item,index) in list" :key="index">
      <div class="pic">
        <img :src="item.img" alt="" />
      </div>
      <div class="name">{{item.name}}</div>
    </div>
 
  </div>
</template>

<script>
export default {
  data() {
    return {
        list:[
        {
            img:"https://m.360buyimg.com/mobilecms/s120x120_jfs/t1/125678/35/5947/4868/5efbf28cEbf04a25a/e2bcc411170524f0.png",
            name:"嗨购超市"
        },
        {
            img:"https://m.360buyimg.com/mobilecms/s120x120_jfs/t1/178015/31/13828/6862/60ec0c04Ee2fd63ac/ccf74d805a059a44.png",
            name:"数码电器"
        },
        {
            img:"https://m.360buyimg.com/mobilecms/s120x120_jfs/t1/41867/2/15966/7116/60ec0e0dE9f50d596/758babcb4f911bf4.png",
            name:"嗨购服饰"
        },
        {
            img:"https://m.360buyimg.com/mobilecms/s120x120_jfs/t1/177902/16/13776/5658/60ec0e71E801087f2/a0d5a68bf1461e6d.png",
            name:"嗨购生鲜"
        },
        {
            img:"https://m.360buyimg.com/mobilecms/s120x120_jfs/t1/196472/7/12807/7127/60ec0ea3Efe11835b/37c65625d94cae75.png",
            name:"嗨购到家"
        },
        {
            img:"https://m.360buyimg.com/mobilecms/s120x120_jfs/t1/185733/21/13527/6648/60ec0f31E0fea3e0a/d86d463521140bb6.png",
            name:"充值缴费"
        },
        {
            img:"https://m.360buyimg.com/mobilecms/s120x120_jfs/t1/36069/14/16068/6465/60ec0f67E155f9488/595ff3e606a53f02.png",
            name:"9.9元拼"
        },
        {
            img:"https://m.360buyimg.com/mobilecms/s120x120_jfs/t1/186080/16/13681/8175/60ec0fcdE032af6cf/c5acd2f8454c40e1.png",
            name:"领券"
        },
        {
            img:"https://m.360buyimg.com/mobilecms/s120x120_jfs/t1/196711/35/12751/6996/60ec1000E21b5bab4/38077313cb9eac4b.png",
            name:"领津贴"
        },
        {
            img:"https://m.360buyimg.com/mobilecms/s120x120_jfs/t1/37709/6/15279/6118/60ec1046E4b5592c6/a7d6b66354efb141.png",
            name:"plus会员"
        }]
    };
  },
};
</script>

<style lang="scss">
.kindcom {
  padding: 0.2778rem 0.8333rem;
  background-color: #fff;
  font-size: 0.6667rem;
  color: rgb(118, 117, 117);
  display: flex;
  justify-content: space-between;
  align-items: center;
  box-sizing: border-box;
  flex-wrap: wrap;

}
.one {
  width: 3.3333rem;
  text-align: center;
  box-sizing: border-box;
  margin-bottom: .4444rem;
}
.kindcom .pic {
  width: 2.2222rem;
}
.name {
  text-align: center;
}

.kindcom .one .pic img {
  width: 100%;
  margin-left: 0.4444rem;
}
</style>